import config from '@/config'
import {ADMIN} from '@/config/default'
import {formatFullPath} from '@/utils/i18n'
import {filterMenu} from '@/utils/authority-utils'
import {getLocalSetting} from '@/utils/themeUtil'
import deepClone from 'lodash.clonedeep'
import vue from 'vue'

const localSetting = getLocalSetting(true)
const customTitlesStr = sessionStorage.getItem(process.env.VUE_APP_TBAS_TITLES_KEY)
const customTitles = (customTitlesStr && JSON.parse(customTitlesStr)) || []

export default {
  namespaced: true,
  state: {
    isMobile: false,
    animates: ADMIN.animates,
    palettes: ADMIN.palettes,
    pageMinHeight: 0,
    pageMaxWidth: window.innerWidth - 60,
    pageMaxHeight: window.innerHeight - 90,
    menuData: [],
    windowMenuData: [],
    activatedFirst: undefined,
    customTitles,
    ...config,
    ...localSetting
  },
  getters: {
    menuData(state, getters, rootState) {
      if (state.filterMenu) {
        const {permissions, roles} = rootState.account
        return filterMenu(deepClone(state.menuData), permissions, roles)
      }
      return state.menuData
    },
    firstMenu(state, getters) {
      const {menuData} = getters
      if (menuData.length > 0 && !menuData[0].fullPath) {
        formatFullPath(menuData)
      }
      return menuData.map(item => {
        const menuItem = {...item}
        delete menuItem.children
        return menuItem
      })
    },
    windowMenu(state){
      return (route)=>{
        return state.windowMenuData.filter(item =>item.path==route)[0]
      }
    },
    subMenu(state) {
      const {menuData, activatedFirst} = state
      if (menuData.length > 0 && !menuData[0].fullPath) {
        formatFullPath(menuData)
      }
      const current = menuData.find(menu => menu.fullPath === activatedFirst)
      return current && current.children || []
    },
    desktopLayoutSize(state){
      let {iconSize,pageMaxWidth,pageMaxHeight} = state;
      let size = {
        mini: [100,24],
        normal: [120,28],
        huge: [140,30]
      }
      let row = Math.floor(pageMaxWidth/size[iconSize][0])
      let col = Math.floor(pageMaxHeight/size[iconSize][1])
      return {
        size: size[iconSize],
        row,
        col,
      }
    },
    wallpaperLists(state){
      const { wallpaper, wallpaperList } = state;
      let id = '';
      wallpaperList.filter((item,index)=>{
        if(item==wallpaper) id = index;
      })
      return {wallpaperList,id}
    },
    rightMenu(){
      let that = new vue();
      return {
        this:this,
        text: [
          "自定义菜单1",
          "自定义菜单2",
          "自定义菜单3",
          "自定义菜单4",
          "自定义菜单5"
        ],
        handler: {
          btnClick1(){
            that.$message.info('自定义菜单1')
          },
          btnClick2(){
            that.$message.info('自定义菜单2')
          },
          btnClick3(){
            that.$message.info('自定义菜单3')
          },
          btnClick4(){
            that.$message.info('自定义菜单4')
          },
          btnClick5(){
            that.$message.info('自定义菜单5')
          },
        }
      }
    }
  },
  mutations: {
    setDevice (state, isMobile) {
      state.isMobile = isMobile
    },
    setTheme (state, theme) {
      state.theme = theme
    },
    setMultiPage (state, multiPage) {
      state.multiPage = multiPage
    },
    setAnimate (state, animate) {
      state.animate = animate
    },
    setFileResolve(state, value){
      state.fileResolve = value
    },
    setRecycleBin(state, value){
      state.recycleBin = value
    },
    setSoundEffect(state,value){
      state.soundEffect = value
    },
    setThumbnail(state,value){
      state.thumbnail = value
    },
    setFileCheck(state, value){
      state.fileCheck = value
    },
    setWallpaper(state, value){
      state.wallpaper = value
    },
    setWeekMode(state, weekMode) {
      state.weekMode = weekMode
    },
    setIconSize(state, value){
      state.iconSize = value
    },
    setStoreStatus(state, value){
      state.storeStatus = value
    },
    setFixedHeader(state, fixedHeader) {
      state.fixedHeader = fixedHeader
    },
    setFixedSideBar(state, fixedSideBar) {
      state.fixedSideBar = fixedSideBar
    },
    setLang(state, lang) {
      state.lang = lang
    },
    setHideSetting(state, hideSetting) {
      state.hideSetting = hideSetting
    },
    correctPageMinHeight(state, minHeight) {
      state.pageMinHeight += minHeight
    },
    correctPageMaxWidth(state, maxWidth) {
      state.pageMaxWidth = maxWidth
    },
    correctPageMaxHeight(state, maxHeight) {
      state.pageMaxHeight = maxHeight
    },
    setMenuData(state, menuData) {
      state.menuData = menuData
    },
    setWindowMenuData(state, menuData) {
      state.windowMenuData = menuData
    },
    setAsyncRoutes(state, asyncRoutes) {
      state.asyncRoutes = asyncRoutes
    },
    setPageWidth(state, pageWidth) {
      state.pageWidth = pageWidth
    },
    setActivatedFirst(state, activatedFirst) {
      state.activatedFirst = activatedFirst
    },
    setFixedTabs(state, fixedTabs) {
      state.fixedTabs = fixedTabs
    },
    setCustomTitle(state, {path, title}) {
      if (title) {
        const obj = state.customTitles.find(item => item.path === path)
        if (obj) {
          obj.title = title
        } else {
          state.customTitles.push({path, title})
        }
        sessionStorage.setItem(process.env.VUE_APP_TBAS_TITLES_KEY, JSON.stringify(state.customTitles))
      }
    },
    
  }
}
